<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>绑定手机</title>
    <meta name="Keywords" content=""/>
    <meta name="description" content="" />
    <script src="__ROOT__/static/home/css/userInfo/js/mui.min.js"></script>
    <link href="__ROOT__/static/home/css/userInfo/css/mui.min.css" rel="stylesheet"/>
    <link href="__ROOT__/static/home/css/login.css" rel="stylesheet"/>
    <link rel="stylesheet" href="__ROOT__/static/home/css/userInfo/css/style.css"/>
    <link href="__ROOT__/static/plugins/layer/skin/layer.css" rel="stylesheet" />
    <link href="__ROOT__/static/home/iconfont/style.css" rel="stylesheet" type="text/css" />
    <link href="__ROOT__/static/home/iconfont/iconfont.css" rel="stylesheet" type="text/css" />
    <script src="__ROOT__/static/home/js/jquery-1.11.1.min.js"></script>
    <script src="__ROOT__/static/plugins/layer.mobile-v2.0/layer_mobile/layer.js"></script>
    <script src="__ROOT__/static/plugins/layer.mobile-v2.0/layer_mobile/need/layer.css"></script>
</head>
<body style="background: #efeff4;">
<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">绑定手机</h1>
</header>
<div class="mui-content">
    <div style="height: 7px;"></div>
    <div><font color="black" style="font-size: 14px;margin: 10px;">输入一个用于绑定的手机号码</font></div>
    <div style="height: 10px;"></div>
    <div class="mui-input-group">
        <div class="mui-input-row">
            <input id='phone' type="text" class="mui-input-clear mui-input" oninput="Verification()" name="user_name" style="font-size: 14px;" placeholder="请输入手机号">
        </div>
    </div>
    <div class="mui-content-padded">
        <button id='code'  class="mui-btn mui-btn-block mui-btn-primary" disabled="disabled">获取验证码</button>
    </div>
</div>
<script>
    $(document).ready(function(){
        $("#code").click(function(){
            var code={};
            code.back=1;
            code.phone=$.trim($("#phone").val());
            var phone=$.trim($("#phone").val());
            if(!phone){
                layer.open({
                    content: '你忘记输入手机号码了'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
            }else if(!(/^1[34578]\d{9}$/.test(phone))){
                layer.open({
                    content: '手机号码格式错误'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
            }else{
                $.ajax({
                    cache:true,
                    type:"POST",
                    url:"{:url('home/Message/getcode')}",
                    dataTypes:"text",
                    data:code,
                    async:false,
                    success:function(data){
                        if(data!=1){
                            layer.open({
                                type: 2
                                ,content:"<font color='#f0ffff'>短信发送中...</font>"
                                ,time:1
                            });
                            setTimeout("window.location.href='{:url('home/Login/code')}'",1000);
                        }else if(data==1){
                            layer.open({
                                content: '该手机已被绑定'
                                ,skin: 'msg'
                                ,time: 2 //2秒后自动关闭
                            });
                        }
                    }
                })
            }
        })
    })
       function Verification(){
           var phone=$.trim($("#phone").val());
            if(phone){
                document.getElementById('code').disabled = false;
            }else{
                document.getElementById('code').disabled = true;
            }
       }
</script>
</body>
</html>
